Ext.define("AM.service.ResizePage", {
    singleton:true,


    getPlayDom:function (index, times) {
        var page = ppt.view.workspace.items.get(index);
        var dom = page.el.dom.cloneNode(true);
        var oldCanvasArr = page.el.dom.getElementsByTagName('canvas');
        var newCanvasArr = dom.getElementsByTagName('canvas');
        var len = newCanvasArr.length;
        for (var i = 0; i < len; i++) {
            AM.service.ResizePage._cloneCanvas(oldCanvasArr[i], newCanvasArr[i]);
        }

        dom.id = 'resizedDom' + index;
        dom.style['-webkit-transform'] = 'scale(' + times + ')';

        Ext.each(dom.childNodes, function (el) {
            el.id = "play-" + el.id;
        })
        return dom;
    },


    getThumbnailsDom:function (index, times) {
        var page = ppt.view.workspace.items.get(index);
        var dom = page.el.dom.cloneNode(true);

        var audioArr = dom.getElementsByTagName('audio');
        Ext.each(audioArr, function (el) {
            el.addEventListener('click', function (e) {
                e.stopPropagation();
            });
        })
        Ext.each(dom.childNodes, function (el) {
            el.id = "th-" + el.id;
        })

        // canvas;
        var oldCanvasArr = page.el.dom.getElementsByTagName('canvas');
        var newCanvasArr = dom.getElementsByTagName('canvas');
        var len = newCanvasArr.length;
        for (var i = 0; i < len; i++) {
            AM.service.ResizePage._cloneCanvas(oldCanvasArr[i], newCanvasArr[i]);
        }


        dom.id = 'resizedDom' + index;
        dom.style['-webkit-transform'] = 'scale(' + times + ')';
        dom.style['-webkit-transform-originX'] = 0;
        dom.style['-webkit-transform-originY'] = 0;
        dom.className = page.getAnimName();
        return dom;
    },


    _cloneCanvas:function (o, n) {
        n.getContext('2d').drawImage(o, 0, 0);
    }


})